<template>
  <div>
     <myBreadcrumb></myBreadcrumb>
    <div>
      <el-divider content-position="left">少年包青天</el-divider>
      <el-divider><i class="el-icon-info"></i></el-divider>
      <el-divider  content-position="center"> 大话c#</el-divider>
      <el-divider content-position="right">阿里云</el-divider>
    </div>
    <div class="block" style="width: 200px">
      <el-timeline>
        <el-timeline-item
          v-for="(activity, index) in activities"
          :key="index"
          :icon="activity.icon"
          :type="activity.type"
          :color="activity.color"
          :size="activity.size"
          :timestamp="activity.timestamp"
        >
          {{ activity.content }}
        </el-timeline-item>
      </el-timeline>
    </div>
  </div>
</template>

<script>

import myBreadcrumb from "@/views/Breadcrumb.vue";

export default {
  data() {
    return {
      activities: [
        {
          content: "商品已出库",
          timestamp: "2018-04-12 20:46",
          size: "large",
          type: "primary",
          color: "red",
        },
        {
          content: "已到达石家庄物流中心",
          timestamp: "2018-04-03 20:46",
          color: "green",
        },
        {
          content: "到达顺义物流中心",
          timestamp: "2018-04-03 20:46",
          size: "large",
          color: "green",
        },
        {
          content: "到达八维",
          timestamp: "2018-04-03 20:46",
          color: "green",
        },
        {
          content: "到达八维",
          timestamp: "2018-04-03 20:46",
          color: "yellow",
        },
        {
          content: "到达八维",
          timestamp: "2018-04-03 20:46",
          color: "green",
        },
        {
          content: "到达八维",
          timestamp: "2018-04-03 20:46",
        },
      ],
    };
  },
    components: {
    myBreadcrumb,
  },
};
</script>

<style>
</style>